<template>
	<view>
		<view class="d-flex">
			<view class="flex-1 line-h d-flex flex-column pt-1 pb-1" hover-class="bg-hover-light-secondary">
				<view class="d-flex j-center a-center">
					<view class="iconfont icon-favorites-fill font-lg text-danger"></view>
				</view>
				<view class="text-center line-h-md " >收藏</view>
			</view>
			<view class="flex-1 line-h d-flex flex-column pt-1 pb-1" hover-class="bg-hover-light-secondary">
				<view class="d-flex j-center a-center">
					<view class="iconfont icon-cart-full font-lg"></view>
				</view>
				<view class="text-center line-h-md">购物车</view>
			</view>
			<view class="font-md text-white bg-warning line-h d-flex j-center a-center" hover-class="bg-hover-warning" style="flex: 2.5;">
				加入购物车
			</view>
		</view>
		<view class="row">
			<view class="span24-4">1</view>
			<view class="span24-4">2</view>
			<view class="span24-4">3</view>
			<view class="span24-4">4</view>
			<view class="span24-4">5</view>
			<view class="span24-4">6</view>
		</view>
		<!-- 轮播图组件 -->
		<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000">
			<swiper-item>
				<view class="swiper-item"></view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				show: false
			}
		},
		onLoad() {
			setTimeout(() => {
				this.show = true
			}, 2000)
		},
		methods: {

		}
	}
</script>

<style lang="scss">
	// .content {
	// 	display: flex;
	// 	flex-direction: column;
	// 	align-items: center;
	// 	justify-content: center;
	// }

	// .logo {
	// 	height: 200rpx;
	// 	width: 200rpx;
	// 	margin-top: 200rpx;
	// 	margin-left: auto;
	// 	margin-right: auto;
	// 	margin-bottom: 50rpx;
	// }

	// .text-area {
	// 	display: flex;
	// 	justify-content: center;
	// }

	// .title {
	// 	font-size: 36rpx;
	// 	color: #8f8f94;
	// }
</style>
